<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta name="viewport" content="width=device-width,initial-scale=1.0"/>
        <title>回帖页面</title>
        <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
        <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
        <script src="js/bootstrap.min.js" type="text/javascript" charset="utf-8"></script>
        
    </head>
    <body>
    	<div class="body">
    		<div class="postMan">
    			<form class="form-inline">
				  <div class="form-group">
				    <label for="exampleInputName2">发帖人：</label>
				    <p type="text" class="form-control" id="name" placeholder="Jane Doe">
				    	<%
				    		Object name=request.getAttribute("name");
				    		out.println(name);
				    	%>
				    </p>
				  </div>
				  <div class="form-group">
				    <label for="exampleInputEmail2">标题：</label>
				    <p type="text" class="form-control" id="title" placeholder="关爱生命">
				    	<%
				    		Object title=request.getAttribute("title");
				    		out.println(title);
				    	%>
				    </p>
				  </div>
				  <div class="form-group">
				  	<label for="exampleInputDate">发帖时间：</label>
				  	<p type="datetime" class="form-control" id="exampleInputDate" placeholder="2017/3/20"/>
				  		<%
				  			Object topicDate=request.getAttribute("topicDate");
				  			out.println(topicDate);
				  		%>
				  	</p>
				  </div>
				</form>
    		</div>
    		<div class="content">
    			<textarea rows="8" style="width: 100%;"><%Object topicTxt=request.getAttribute("content");out.println(topicTxt);%></textarea>
    			<%
    				Object id=request.getAttribute("id");
    				out.println("<a href='DownloadServlet?id="+id+"'/>文件下载</a>");
    			%>
    			<!--<a href="DownloadServlet">文件下载</a>-->
    			
    		</div>
    		<div id="comment">
    			
    		</div>
    		<div class="foot">
    			<div class="btn">
    				<textarea id="textarea" name="comment" rows="4" class="form-control"></textarea>
    				<label id="commentLabel" class="btn btn-primary">我要评论</label>
					
    			</div>
    		</div>
    	</div>
    	<script type="text/javascript">
    		$(".body").css({"width":"980px","margin":"auto"});
    		$(".btn").css({"float":"right"});
    		
    		 $(document).ready(function(){
    			var url=window.location.search;//得到网址路径 
    			var idValue=url.substring(url.indexOf("=")+1);
    			/*var grade=0;
    			
    			if($("#comment").html().equals("")){
    				grade=1;
    			}else{
    				var id=$("#comment ul").lastChild().attr("id");
    				grade=id+1;
    			} */
    			
    			$("#commentLabel").click(function(){
    				var comm=$("#textarea").val();
    				$.ajax({
    					type:"post",
    					url:"ViewPostServlet",
    					async:true,
    					data:{"comment":comm,"id":idValue},//拼了一个JSON
    					success:function(){
    						alert("评论成功，请刷新");
    					}
    				});
    			})
    			$.ajax({
    				type:"post",
    				url:"ShowReplyServlet",
    				async:true,
    				data:{"id":idValue},
    				success:function(data){
    					var jsonObj=jQuery.parseJSON(data);
    					html="<ul class='list-group'>";
    					$.each(jsonObj, function(i,obj) {//遍历
							html+="<li class='list-group-item'><form class='form-inline'><div class='form-group'><label>评论用户昵称</label><div class='form-control'>"+obj.name;
							html+="</div></div><div class='form-group'><label>评论内容</label><div class='form-control'>"+obj.txt;
							html+="</div></div><div class='form-group'><label>评论时间</label><div class='form-control'>"+obj.replyDate;
							html+="</div></div></form></li>";
							html+="<li><input type='text' name='na'/><a href='ExchangeServlet?id="+obj.id+"'>回复</a></li>";
						});
    					html+="</ul>";
    					$("#comment").append(html);
    				}
    			});
    			
  			
    		})
    	</script>
    	
    
 	</body>
</html>